<template>
  <!--  组件的页面结构-->
  <div id="box">
    <h1>学生信息</h1>
    <p>姓名:{{name}}</p>
    <p>年龄:{{age}}</p>
    <p>班级:{{clazz}}</p>
  </div>
</template>


<script>
// 创建组件对象   导出 对象   export default   默认导出    一个组件只能有一个
export default  {
   name: "StudentView",
   data(){
     return{
       name:'tom',
       age:20,
       clazz:'python2512'
     }
   } ,
  methods:{

  },
  created(){

  },
  components:{

  }
}

</script>


<style scoped>
/*组件css样式  scoped 表示样式只对当前组件有效 */
#box{
  width: 200px;
  height: 200px;
  border: 1px solid red;
}
</style>
